<!DOCTYPE html>
<html lang="zh-CN">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<title>全部商品</title>
		<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, width=device-width">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-touch-fullscreen" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<meta name="format-detection" content="telephone=no">
		<meta name="format-detection" content="address=no">
		<link rel="stylesheet" type="text/css" href="css/common.css">
		<link rel="stylesheet" type="text/css" href="css/index.css">
		<link rel="stylesheet" type="text/css" href="css/mui.min.css"/>
		<link rel="stylesheet" href="css/reset.css">
		<script src="js/jquery-1.8.2.min.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript" src="js/jquery.min.js"></script>
		<script type="text/javascript" src="js/iscroll.js"></script>
		<script type="text/javascript" src="js/jquery.flexslider-min.js"></script>
		<script src="js/hmt.js" type="text/javascript"></script>
		<script type="text/javascript" src="js/index.js"></script>
		<script src="js/swiper.min.js" type="text/javascript" ></script>
		
		<script src="js/other.js" type="text/javascript"></script>
		
		<script type="text/javascript" src="http://yanyubao.tseo.cn/Tpl/static/jquery.tmpl.js"></script>
    	<script type="text/javascript" src="http://yanyubao.tseo.cn/Tpl/Home/default/js/jquery.lazyload.min.js"></script>
    	
	
		<script type="text/javascript" src="js/abot.js"></script>
 		<script type="text/javascript" src="http://yanyubao.tseo.cn/api/shopapp.js"></script> 

		
	</head>
	<body>
		<header class="hasManyCity hasManyCitytwo" id="header">
			<a href="index.html" class="fl fanhui"><i class="iconfont icon-fanhui"></i></a>
			<a href="category.html"><div id="locaitonBtn" class="link-url locaitonBtn"></div></a>
			<div id="" class="searchBox">
				<a href="search.html">
					<i class="icon-search"></i>
					<span>请输入您想找的内容</span>
				</a>
			</div>
		</header>
		
		
		<!-- screening -->
		<div class="screening">
		    <ul>
		        <li class="Brand" style="width: 50%;">全部分类</li>
		        <li class="Sort" style="width: 50%;">智能排序</li>
		    </ul>
		</div>
		<!-- End screening -->		
		<!-- Category -->
		<div class="Category-eject">
		    <ul class="Category-w" id="cata_list">
		    	<script id="template_cata_list" type="text/x-jquery-tmpl">

				<li><a href="mall.html?cataid=${cataid}">${name}</a></li>	
		        </script>
		    </ul>
		</div>

		<div class="Sort-eject Sort-height">
		    <ul class="Sort-Sort" id="Sort-Sort">
		        <li onclick="Sorts(this)">智能排序</li>
		        <li onclick="Sorts(this)">离我最近</li>

		    </ul>
		</div>
<!-- 		
		<div class="Category-eject">
		    <ul class="Category-w" id="Categorytw">
		        <li onclick="Categorytw(this)">全部品牌</li>
		        <li onclick="Categorytw(this)">奥迪</li>
		        <li onclick="Categorytw(this)">丰田</li>
		        <li onclick="Categorytw(this)">本田</li>
		        <li onclick="Categorytw(this)">大众</li>
		        <li onclick="Categorytw(this)">别克</li>
		        <li onclick="Categorytw(this)">标志</li>
		        <li onclick="Categorytw(this)">东风悦达起亚</li>
		        <li onclick="Categorytw(this)">东风</li>
		        <li onclick="Categorytw(this)">奔驰</li>
		        <li onclick="Categorytw(this)">玛莎拉蒂</li>
		        <li onclick="Categorytw(this)">保时捷</li>
		        <li onclick="Categorytw(this)">广汽传祺</li>
		    </ul>
		    <ul class="Category-t" id="Categoryt">
		        <li onclick="Categoryt(this)">奥迪A6</li>
		        <li onclick="Categoryt(this)">奥迪A6L</li>
		        <li onclick="Categoryt(this)">奥迪A4</li>
		        <li onclick="Categoryt(this)">奥迪A4L</li>
		        <li onclick="Categoryt(this)">奥迪A5</li>
		        <li onclick="Categoryt(this)">奥迪A8</li>
		        <li onclick="Categoryt(this)">奥迪A8L</li>
		        <li onclick="Categoryt(this)">奥迪A3</li>
		        <li onclick="Categoryt(this)">奥迪Q5</li>
		        <li onclick="Categoryt(this)">奥迪Q7</li>
		        <li onclick="Categoryt(this)">奥迪TT</li>
		        <li onclick="Categoryt(this)">奥迪R8</li>
		    </ul>
		    <ul class="Category-s" id="Categorys">
		        <li onclick="Categorys(this)">发动机(/进排气系统/燃油系统/冷却系统等)</li>
		        <li onclick="Categorys(this)">变速箱</li>
		        <li onclick="Categorys(this)">离合器</li>
		        <li onclick="Categorys(this)">转向</li>
		        <li onclick="Categorys(this)">制动</li>
		        <li onclick="Categorys(this)">传动/前后桥</li>
		        <li onclick="Categorys(this)">悬挂/车架/车厢</li>
		        <li onclick="Categorys(this)">轮胎/钢圈/轮毂</li>
		        <li onclick="Categorys(this)">暖风/柴暖/空调系统</li>
		        <li onclick="Categorys(this)">汽车电器/电子/传感器</li>
		        <li onclick="Categorys(this)">汽车电脑/电子控制单元系统</li>
		        <li onclick="Categorys(this)">汽车光电/汽车影音/电子防盗系统</li>
		        <li onclick="Categorys(this)">驾驶室/装饰件</li>
		        <li onclick="Categorys(this)">轴承/密封件/橡胶件/标准件</li>
		        <li onclick="Categorys(this)">汽车润滑/油/脂/液/汽车用品</li>
		        <li onclick="Categorys(this)">汽保工具/设备工具/维修设备</li>
		        <li onclick="Categorys(this)">液压件/齿轮齿件/挂车/工程机专用件</li>
		        <li onclick="Categorys(this)">其他</li>
		    </ul>
		</div>
		End Category
		grade
		<div class="grade-eject">
		    <ul class="grade-w" id="gradew">
		        <li onclick="grade1(this)">哈尔滨</li>
		        <li onclick="grade1(this)">全国</li>
		        <li onclick="grade1(this)">北京</li>
		        <li onclick="grade1(this)">天津</li>
		        <li onclick="grade1(this)">河北</li>
		        <li onclick="grade1(this)">山西</li>
		        <li onclick="grade1(this)">内蒙古</li>
		        <li onclick="grade1(this)">辽宁</li>
		        <li onclick="grade1(this)">吉林</li>
		        <li onclick="grade1(this)">黑龙江</li>
		        <li onclick="grade1(this)">上海</li>
		        <li onclick="grade1(this)">江苏</li>
		        <li onclick="grade1(this)">山东</li>
		        <li onclick="grade1(this)">河南</li>
		        <li onclick="grade1(this)">湖北</li>
		        <li onclick="grade1(this)">湖南</li>
		        <li onclick="grade1(this)">广东</li>
		        <li onclick="grade1(this)">广西</li>
		        <li onclick="grade1(this)">海南</li>
		    </ul>
		    <ul class="grade-t" id="gradet">
		        <li onclick="gradet(this)">全河北</li>
		        <li onclick="gradet(this)">石家庄</li>
		        <li onclick="gradet(this)">唐山</li>
		        <li onclick="gradet(this)">秦皇岛</li>
		        <li onclick="gradet(this)">邢台</li>
		        <li onclick="gradet(this)">保定</li>
		        <li onclick="gradet(this)">张家口</li>
		        <li onclick="gradet(this)">承德</li>
		        <li onclick="gradet(this)">沧州</li>
		        <li onclick="gradet(this)">廊坊</li>
		        <li onclick="gradet(this)">衡水</li>
		    </ul>
		    <ul class="grade-s" id="grades">
		        <li onclick="grades(this)">全秦皇岛</li>
		        <li onclick="grades(this)">海港区</li>
		        <li onclick="grades(this)">山海关区</li>
		        <li onclick="grades(this)">北戴河区</li>
		        <li onclick="grades(this)">青龙满族自治区</li>
		        <li onclick="grades(this)">昌黎县</li>
		        <li onclick="grades(this)">抚宁县</li>
		        <li onclick="grades(this)">卢龙县</li>
		        <li onclick="grades(this)">其他区</li>
		        <li onclick="grades(this)">经济技术开发区</li>
		    </ul>
		</div>
		End grade
		Category
		<div class="Sort-eject Sort-height">
		    <ul class="Sort-Sort" id="Sort-Sort">
		        <li onclick="Sorts(this)">智能排序</li>
		        <li onclick="Sorts(this)">离我最近</li>
		        <li onclick="Sorts(this)">好评优先</li>
		        <li onclick="Sorts(this)">最新发布</li>
		        <li onclick="Sorts(this)">人气优先</li>
		        <li onclick="Sorts(this)">价格最低</li>
		        <li onclick="Sorts(this)">价格最高</li>
		    </ul>
		</div>
	 -->
	
		<!-- End Category -->
		<div id="container">		
			<div id="main">
				<div class="guess-like">
	
					<dl class="list">
	
						<dd>
							<dl class="list" id="product_list">
							 <script id="template_product" type="text/x-jquery-tmpl">
								<dd>

									<a href="mall-detail.html?productid=${productid}" class="react">
										<div class="dealcard">
											<div class="dealcard-img imgbox">
												<span></span>
												<img src="${picture}" style="height: 100%;width: 100%;">
											</div>
											<div class="dealcard-block-right">
												<div class="dealcard-brand single-line">${name}</div>
												<div class="title text-block" style="color: blueviolet;">${cataname}</div>

												<div class="price">
													<span class="strong">${price}</span>
													<span class="strong-color">元</span>
													<span class="tag">${cataname_parent}</span>
													<span class="line-right">
										                                        已售${sale_volume}
										            </span>
												</div>
											</div>
										</div>
									</a>
								</dd>
							</script>
								
								<!-- 
								<dd>
									<a href="mall-detail.html" class="react">
										<div class="dealcard">
											<div class="dealcard-img imgbox">
												<span></span>
												<img src="img/thumb_543ba5688cb7b.jpg"/>
											</div>
											<div class="dealcard-block-right">
												<div class="dealcard-brand single-line">锅里添香美食涮烤自助餐厅</div>
												<div class="title text-block">[宿州路]单人自助中餐</div>
												<div class="price">
													<span class="strong">49.9</span>
													<span class="strong-color">元</span>
													<span class="tag">多优惠+</span>
													<span class="line-right">
										                                        已售50293
										            </span>
												</div>
											</div>
										</div>
									</a>
								</dd>
								-->					
							</dl>
						</dd>
	
						<dd class="db">
							<a class="react " href="#">
								 <div class="moreone" id="emLoadnull">加载更多</div>
							</a>
						</dd>
					</dl>
		
				</div>
			</div>
		</div>

	<script type="text/javascript">
	
	/* 商品列表 */
	//定义获取商品列表函数，具体功能位获取的数据以Template模板添加到prduct_list父类中
	var next_page = 1;
	var _is_loading = false;

	function product_list_callback(code, counter, product_list){
		_is_loading = false;
		
		console.log('code:'+code);	
		
		if(code == 0){
			next_page = -1;
			console.log('aaaaaaaaaaaaa');
			
			$("#product_list").append("<div style='width:100%;height:30px;line-height:30px;text-align:center;color:#666;clear: both;'>我也是有底线的</div>");
			$("#emLoadnull").css('display','none');
		}
		else{
			$('#template_product').tmpl(product_list).appendTo('#product_list');
			
			$("img.lazy").lazyload({	
				placeholder : '/Tpl/Home/default/js/img/grey.gif', /*加载图片前的占位图片*/
				effect      : "fadeIn" /*加载图片使用的效果(淡入)*/
			});
			
			var img_width = $(".goods-img img").width();//上边图片，下边详情
			//var img_height = img_width*2/3;
			var img_height = img_width;
			//alert(img_height);
			$(".goods-img img").css({'height':img_height}); //1:1的图片比例
		}
	}

	$(function () {
		//商品列表	
		var GET = $.urlGet();
		var cataid = GET['cataid'];
		var data = {'cataid':cataid};
	 	get_product_list(data, product_list_callback);
	 	
	 	/* 点击 加载更多 */	
	  	$('#emLoadnull').click(function(){
			if(next_page == -1){
				return;
			}
			data = {'page':next_page++, };
		 	get_product_list(data, product_list_callback);
		});
	 
	 	
	  	/* 不去点击 加载更多，而是自动加载更多 */	
		//var range = 50;             //距下边界长度/单位px  
		//var _srollPos = 0;
		//var pageNum = 2;
	   // var totalheight = 0; 
	    //var main = $("#list_article");
		//var js = 0;
		
	    //$(window).scroll(function(){
	   //    var srollPos = $(window).scrollTop();    //滚动条距顶部距离(页面超出窗口的高度)  
	 //      if(srollPos<_srollPos){
	  //          return;
	  //     }else{
	  //     	_srollPos = srollPos;
	  //     }
	  //     
	  //     if(_is_loading){
	    	   //alert('aaaaa');
	   // 	   return;
	   //    }
	       
	   //    totalheight = parseFloat($(window).height()) + parseFloat(srollPos);  
	   //    if(($(document).height()-range) <= totalheight ) {
	   // 	   _is_loading = true;

	   //    if (next_page == -1){
	   //       return;
	   //     } else{
	   //     	data = {'page':next_page++, };
	   //  	 	get_product_list(data, product_list_callback);
	   //     }
	   //   }
	  //  });
	
	});
	
	//商品列表
	function ajax_request_server_callback(res){
		$('#template_cata_list').tmpl(res.data).appendTo('#cata_list');
		console.log(res.data);
	};

	$(function () {
			var function_name = "product_cata_supplier";
			var request_data = {'sellerid':sellerid};
			ajax_request_server(function_name, request_data, ajax_request_server_callback);
		
	});
	
	</script>
	
	</body>
</html>
